// 转让审核
<template>
  <div class="transferAudit">
    <el-breadcrumb separator="/" class="bread-title">
      <el-breadcrumb-item :to="{ path: '/projectList' }">跟投项目管理</el-breadcrumb-item>
      <el-breadcrumb-item :to="{ path: '/transferManagement' }">跟投转让管理</el-breadcrumb-item>
      <el-breadcrumb-item>审核</el-breadcrumb-item>
    </el-breadcrumb>
    <div class="part">
      <div class="title">转让人信息</div>
      <div class="content">
        <p>
          <span>转让人姓名：</span>
          <span>{{assignor.staffName}}</span>
        </p>
        <p>
          <span>工号：</span>
          <span>{{assignor.staffCode}}</span>
        </p>
        <p>
          <span>业务线：</span>
          <span>{{assignor.businessLineName}}</span>
        </p>
        <p>
          <span>部门：</span>
          <span>{{assignor.departmentName}}</span>
        </p>
        <p>
          <span>职位：</span>
          <span>{{assignor.stationName}}</span>
        </p>
      </div>
    </div>
    <div class="part">
      <div class="title">受让人信息</div>
      <div class="content">
        <p>
          <span>受让人姓名：</span>
          <span>{{assignee.staffName}}</span>
        </p>
        <p>
          <span>工号：</span>
          <span>{{assignee.staffCode}}</span>
        </p>
        <p>
          <span>业务线：</span>
          <span>{{assignee.businessLineName}}</span>
        </p>
        <p>
          <span>部门：</span>
          <span>{{assignee.departmentName}}</span>
        </p>
        <p>
          <span>职位：</span>
          <span>{{assignee.stationName}}</span>
        </p>
      </div>
    </div>
    <div class="part">
      <div class="title">转让信息</div>
      <div class="content">
        <p>
          <span>项目名称：</span>
          <span>{{detailInfo.projectName}}</span>
        </p>
        <p>
          <span>跟投金额：</span>
          <span>￥{{detailInfo.investMoney | numFormat}}</span>
        </p>
        <p>
          <span>跟投份额：</span>
          <span>{{detailInfo.investNum}}份</span>
        </p>
      </div>
      <div class="content">
        <p>
          <span>确认状态：</span>
          <span v-show="detailInfo.confirmationStatus == 0">待确认</span>
          <span v-show="detailInfo.confirmationStatus == 1">已确认</span>
          <span v-show="detailInfo.confirmationStatus == 2">驳回</span>
        </p>
        <p>
          <span>确认时间：</span>
          <span>{{detailInfo.confirmationTime}}</span>
        </p>
        <p></p>
      </div>
      <div>
        <el-form :inline="true" :model="formInline" class="demo-form-inline">
          <el-form-item label="*转让类型：">
            <el-select v-model="formInline.region">
              <el-option label="投资转让" value="0"></el-option>
              <el-option label="离职转让" value="1"></el-option>
              <el-option label="其他" value="9"></el-option>
            </el-select>
          </el-form-item>
        </el-form>
      </div>
      <div class="agreement">
        <div class="agreement-two">
          <uploadImg @uploadSuccess="uploadSuccess" ref="isDel"></uploadImg> 
        </div>
      </div>
      <div class="agreement-detail">
        <template>
          <el-table
            :data="Agreement"
            border
            style="width: 100%">
            <el-table-column
              fixed
              align=center
              label="序号"
              type="index"
              width="80">
            </el-table-column>
            <el-table-column
              align=center
              prop="FileName"
              label="文件名"
              width="150">
            </el-table-column>
            <el-table-column
              align=center
              prop="enclosureName"
              label="上传附件名"
              width="180">
            </el-table-column>
            <el-table-column
              align=center
              prop="createdName"
              label="创建人"
              width="120">
            </el-table-column>
            <el-table-column
              align=center
              prop="createdTime"
              label="上传时间"
              width="150">
            </el-table-column>
            <el-table-column
              align=center
              fixed="right"
              label="操作">
              <template slot-scope="scope">
                <el-button @click="handleEdit(scope.row)" type="text" size="small">编辑文件名</el-button>
                <el-button type="text" size="small"><a v-bind:href="fileUrl[0]" target="_blank">下载</a></el-button>
                <el-button @click="handlePdf(scope.row)" type="text" size="small" :disabled="suffix == 'pdf' ? false:true">PDF预览</el-button>
                <el-button @click="handleRemove(scope.row)" type="text" size="small">删除</el-button>
              </template>
            </el-table-column>
          </el-table>
        </template>
      </div>
      <div class="opinion">
        <div>审核意见：</div>
        <textarea name="opinion" v-model="auditOpinions" id="" cols="150" rows="10" maxlength='100'></textarea>
      </div>
      <div class="yes-no">
        <span>*是否线下已经退款给对方：</span>
        <template>
          <el-radio v-model="radio" label="1">是</el-radio>
          <el-radio v-model="radio" label="0">否</el-radio>
        </template>
      </div>
    </div>
    <div class="btn">
      <el-button type="primary" @click="handlePass(1)">审核通过</el-button>
      <el-button type="primary" @click="handlePass(2)">审核不通过</el-button>
    </div>
    <el-dialog
      title="修改文件名"
      :visible.sync="dialogVisible"
      width="30%"
      :before-close="handleClose">
      <el-input v-model="fileNewName"></el-input>
      <span slot="footer" class="dialog-footer">
        <el-button @click="handleCancle">取 消</el-button>
        <el-button type="primary" @click="handleConfirm">确 定</el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>
import api from '@/api/apiPath'
import uploadImg from './xkuploadImg'
import util from '@/common/utils'
export default {
  name:'transferAudit',
  components:{
    uploadImg
  },
  data(){
    return {
      dialogVisible:false,
      radio: '0',
      formInline: {
        region: ''
      },
      FileName:'',
      fileNewName:'',
      fileUrl:'',
      typeForm:{},
      assignee:{},
      detailInfo:{},
      assignor:{},
      Agreement:[],
      suffix:'',
      auditOpinions:'',
    }
  },
  filters:{
    numFormat(val ){
      val += ''
      let x = val.split('.');
      let x1 = x[0] 
      let x2 = x.length > 1 ? '.' + x[1] : ''
      var rgx = /(\d+)(\d{3})/  
      while (rgx.test(x1)) {  
      x1 = x1.replace(rgx, '$1' + ',' + '$2')
      }
      return x1 + x2
    }
  },
  created(){
    this.getDetail()
  },
  methods:{
    handleClose(done) {
      this.$confirm('确认关闭？')
        .then(_ => {
          done();
        }).catch(_ => {});
    },
    handleConfirm(){
      this.Agreement[0].FileName = this.fileNewName
      this.dialogVisible = false
    },
    handleCancle(){
      this.dialogVisible = false
    },
    // 编辑文件名
    handleEdit(){
      this.dialogVisible = true
    },
    // 预览pdf
    handlePdf(){
      window.open(this.fileUrl)
    },
    // 删除
    handleRemove(){
      this.$confirm('确定删除文件吗?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        this.Agreement = []
        this.$refs.isDel.delFile();
        this.$message({
          type: 'success',
          message: '删除成功!'
        })
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消删除'
        }) 
      })
    },
    // 上传成功
    uploadSuccess(data,info) {
      this.fileUrl = data // 文件地址
      this.suffix = info.name.substr(info.name.lastIndexOf('.')+1) // 后缀
      this.FileName = info.name.substring(0,info.name.lastIndexOf(".")) // 文件名
      const time = util.getTimeString(new Date().getTime()) // 上传时间
      const userName = JSON.parse(window.sessionStorage.getItem('cmsUser')).name // 创建人
      if(!this.Agreement.length){
        this.Agreement.push({FileName:this.FileName, enclosureName:info.name,createdName:userName,createdTime:time})
      }
    },
    // 审核通过
    handlePass(val){
      let fileList = []
      let radio = ''
      if(val == 1){
        if(this.formInline.region == ''){
          return this.$message('请选择转让类型')
        }
        if(!this.Agreement.length){
          return this.$message('请选择上传协议')
        }
        radio = this.radio
        fileList.push({
          fileAddress:this.fileUrl[0],
          fileUploadName:this.Agreement[0].enclosureName,
          fileName:this.Agreement[0].FileName
        })
      }else{
        radio = 0
      }
      if(!this.auditOpinions){
        return this.$message('请填写审核意见')
      }
      console.log(fileList)
      this.axios.post(api.auditTransfer,{
        id:this.$route.query.id,
        auditStatus:val,
        auditOpinions:this.auditOpinions,
        transferType:this.formInline.region,
        offlineRefundFlag: radio,
        fileList:fileList
      }).then((res)=>{
        if(res.data.code === 200){
          if(val == 1){
            this.$message('审核已通过')
          }else if(val == 2){
            this.$message('审核不通过')
          }
          this.$router.push('/transferManagement')
        }
      })
    },
    // 基本信息
    getDetail(){
      this.axios.get(api.selectTransferDetail + '/' + this.$route.query.id).then((res)=>{
        console.log(res)
        if(res.data.data.assignor){
          this.assignor = res.data.data.assignor
        }
        if(res.data.data.assignee){
          this.assignee = res.data.data.assignee
        }
        this.detailInfo = res.data.data
      })
    }
  }
}
</script>

<style lang='stylus'>
.transferAudit{
  .bread-title{
    height:30px;
    font-size:16px;
  }
  .title{
    font-size :18px;
    font-weight :700;
  }
  .part{
    margin-bottom :30px;
  }
  .typeSuffix{
    font-size :14px;
    color :#ccc;
    margin-top :10px;
  }
  .content{
    display :flex;
    p{
      flex:1;
      font-size :15px;
    }
  }
  .el-select .el-input__inner{
    height :30px;
  }
  .el-form-item__label{
    font-size :15px;
  }
  .agreement{
    display :flex;
    width :400px;
    .agreement-one{
      flex:1;
      font-size :15px;
    }
    .agreement-two{
      flex:3;
    }
  }
  .suffix{
    font-size :12px;
    margin-top :10px;
  }
  .agreement-detail,.opinion,.yes-no{
    margin-top :30px;
  }
  .opinion div{
    margin-bottom  :20px;
  }
  .btn{
    padding-left:30%;
    box-sizing :border-box;
    margin-bottom :50px;
  }
  a{
    text-decoration: none;
    color: #409EFF;
  }
}
</style>
